<template>
	<span class="money">
		<span>{{ text.main }}</span>
	</span>
</template>

<script>
export default {
	name: 'Money',
	props: {
		value: {
			type: String,
			default: ''
		}
	},
	computed: {
		text() {
			const value = this.value
			if (value.includes('NaN')) {
				return {
					main: value.replace('NaN', '-')
				}
			}
			return {
				main: value
			}
		}
	}
}
</script>
<style scoped>
.money {
	display: inline-flex;
	align-items: baseline;
}
</style>
